﻿@page "/authentication/register"
@layout EmptyLayout



<div class="register">

	<Form @ref="_registerForm"
		  ValidateOnChange="false"
		  Model="@_model"
		  Layout="Vertical"
		  Style="width:550px"
		  Class="registerForm">
	<FormItem>
		<h1 style="margin-bottom:20px;text-align:center;font-weight:bold">Register</h1>
	</FormItem>
		<FormItem Label="用户名">
			<Input @bind-Value="@context.UserName" />
		</FormItem>
		<FormItem Label="密码">
			<InputPassword @bind-Value="@context.Password" />
		</FormItem>
		<FormItem Label="昵称">
			<Input @bind-Value="@context.NickName" />
		</FormItem>
		<FormItem Label="邮箱">
			<Input @bind-Value="@context.Email" />
		</FormItem>
		<FormItem Label="手机">
			<Input @bind-Value="@context.PhoneNumber" />
		</FormItem>
		<FormItem Label="生日">
			<DatePicker TValue="DateTime?" Picker="@DatePickerType.Date" @bind-Value="@context.BrithDay" Placeholder="@("请选择您的生日")" />
		</FormItem>
		<FormItem Label="所在地">
			<InputGroup Compact>
				
				<FormItem NoStyle>
					<Select DataSource="@_provinces"
							@bind-Value="@context.Address.Province"
							ValueName="@nameof(NestedModel.Name)"
							LabelName="@nameof(NestedModel.Name)"
							Placeholder="省份"
							DefaultActiveFirstItem
							OnSelectedItemChanged="OnProvinceSelectedItemChanged"
							Style="width:150px"
							EnableSearch>
					</Select>

					
				</FormItem>

			
				<FormItem NoStyle>
					<Select DataSource="@_cities"
							@bind-Value="@context.Address.City"
							ValueName="@nameof(NestedModel.Name)"
							LabelName="@nameof(NestedModel.Name)"
							DefaultActiveFirstItem
							OnSelectedItemChanged="OnCitySelectedItemChanged"
							Placeholder="城市"
							Style="width:200px"
							EnableSearch>
					</Select>
				</FormItem>
				<FormItem NoStyle>
					<Select DataSource="@_counties"
							@bind-Value="@context.Address.County"
							ValueName="@nameof(NestedModel.Name)"
							LabelName="@nameof(NestedModel.Name)"
							DefaultActiveFirstItem
							Placeholder="区县"
							Style="width:150px"
							EnableSearch>
					</Select>
				</FormItem>
			</InputGroup>
		</FormItem>
		<FormItem Label="个性签名">
			<TextArea  @bind-Value="@context.Signature" />
		</FormItem>
		<FormItem>
			<Button Id="lgBtn" Type="@ButtonType.Primary" HtmlType="submit">
				注册
			</Button>
		</FormItem>
	</Form>
</div>
<style>
	.registerForm{
	padding: 20px;
    opacity: 0.8;
    border-radius: 5px;
	background-color: white;
	}
	#lgBtn {
    background-color: #314C5D;
    border-color: #314C5D;
	transform: translate(-50%,0%);
	left:50%;
   }
    #lgBtn:hover {
        background-color: #190710;
        border-color: #190710;
    }

    #lgBtn:focus {
        background-color: #190710;
        border-color: #190710;
    }

</style>